<div class="itmp-pagination flex flex-row flex-justify-end flex-items-center">
  <div class="pagination-info" *ngIf="count > 0 && totalEle > 0 && showCountInfo">{{eleInfo}}</div>
  <div class="pagination-opt flex-auto flex flex-row flex-justify-end flex-items-center no-print">
    <nz-select class="pagesize-selector opt-item"
      [ngModel]="pageSize"
      (ngModelChange)="onPageSizeChange($event)"
      style="width:66px">
      <nz-option *ngFor="let pageSize of pageSizeOptions"
        [nzValue]="pageSize"
        [nzLabel]="pageSize">
      </nz-option>
    </nz-select>

    <button nz-button
      class="opt-item"
      nzSize="defualt"
      [disabled]="pageNum === 1"
      (click)="onPageChange(1)"
      nzShape="circle"><i class="iconfont icon-icverticleleft"></i></button>
    <button nz-button
      class="opt-item"
      nzSize="defualt"
      [disabled]="pageNum === 1"
      (click)="onPageChange(pageNum - 1)"
      nzShape="circle"><i class="iconfont icon-left"></i></button>
    <div class="page-num opt-item">
      {{pageNum}}
    </div>
    <button nz-button
      class="opt-item"
      nzSize="defualt"
      [disabled]="pageNum === pageEnd"
      (click)="onPageChange(pageNum + 1)"
      nzShape="circle"><i class="iconfont icon-right"></i></button>
    <button nz-button
      class="opt-item"
      nzSize="defualt"
      [disabled]="pageNum === pageEnd"
      (click)="onPageChange(pageEnd)"
      nzShape="circle"><i class="iconfont icon-icverticleright"></i></button>
    <div style="font-size:14px;"
      class="text-ellipsis opt-item">
      {{'page.GoToPage' | translate}}
    </div>
    <input type="text"
      nz-input
      class="opt-item"
      #pageInput
      style="width:40px;" 
      (keyup)="gotoPageEnterHandle($event, pageInput.value)"/>
    <!-- <div class="opt-item">
      / {{pageEnd}}
    </div> -->
    <i class="iconfont icon-right1 opt-item cur-p"
      (click)="jump(pageInput.value)"></i>
  </div>
</div>